<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>CSS样式</title>
		<!-- html中元素自带属性和属性值，可做单个元素的效果
		     CSS3样式效果：整体页面/单个元素的效果
			 使用CSS3  1.引入CSS3样式【4种】
			            1.1内联样式表 (不建议使用 ，未实现内容与表现分离)
						1.2内部样式表 (练习专用)
						   1.2.1使用方式，head元素添加style元素
						   1.2.2 编写CSS3  选择器-元素选择器：抓取页面元素
						1.3外部样式表 （项目专用）
						   1.3.1 使用方式：head元素 添加link元素，指定CSS文件
						   1.3.2 创建  xxx.css文件
						1.4引入样式表（不用，致命bug，CSS2的语法）
						   1.4.1 使用：在head中添加 style元素
						   1.4.2 创建 xxx.css文件
						   1.4.3 在style元素中添加一个标签  @import url(xxx.css)
						   缺点：项目内容比较大：先执行结构，等一会，效果加不上
						         一般是先执行效果css然后再执行 html
			          2.编写CSS3的基础语法,重点了解css属性与属性值、选择器的使用
					  
		-->
		<style>
			@import url(css/引入样式表.css);
			/* CSS3注释 */
			p{
				/* css3里的属性和属性值   添加效果（样式）*/
				/* 效果为居中 */
				text-align: center;
				/* 背景颜色效果  色值：十六进制 网页的颜色 ：红绿蓝*/
				background-color:#aaffff;
				font-size:50px;
				/* 效果：宽高 */
				width:240px;
				height: 240px;
				/* 效果 行高  与高度一致，呈现垂直居中的效果*/
				line: height 240px;;
			}
		</style>
	<link rel="stylesheet" href="css/index.css">
	</head>
	<body>
		<!-- html效果 -->
		<p>lorem1</p>
		<!-- CSS效果 -->
		<p>lorem2</p>
		<span>行元素内容</span>
	</body>
</html>
